<template>

    <el-dialog v-model="dialogTableVisible"
        style="border-radius: 32px;width: 6.42rem;height:3.54rem;min-width: 400px;min-height: 240px;" title=""
        width="800">
        <div class="pop">
            <div
                style="color: #26203B;text-align: center;font-family:PingFang SC; font-size: 28px; font-style: normal; font-weight: 400;">
                {{ showData.cont }}
            </div>
            <div class="popBtm flex-center-center">
                <div @click="dialogTableVisible = false" class="cancel flex-center-center">
                    暂不
                </div>
                <div @click="emits('confirm', showData.type); dialogTableVisible = false"
                    class="confirm flex-center-center">
                    确定
                </div>
            </div>
        </div>
    </el-dialog>
</template>

<script setup>
import { reactive, ref } from 'vue'
const dialogTableVisible = ref(false)
const showData = reactive({
})
const init = (cont, type) => {
    dialogTableVisible.value = true
    showData.cont = cont
    showData.type = type
}
const emits = defineEmits(['confirm'])

defineExpose({
    init
})

</script>

<style lang="scss" scoped>
.popBtm {
    margin-top: 0.94rem;

    .cancel {
        width: 2.06833rem;
        height: 0.68027rem;
        min-width: 90px;
        min-height: 30px;
        flex-shrink: 0;
        border-radius: 32px;
        border: 1px solid #007AFF;
        background: #E5EEFD;
        color: #26203B;
        font-family: "PingFang SC";
        font-size: 20px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        text-transform: capitalize;
    }

    .confirm {
        width: 2.06833rem;
        height: 0.68027rem;
        min-width: 90px;
        min-height: 30px;
        flex-shrink: 0;
        border-radius: 32px;
        background: #007AFF;
        color: #FFF;
        font-family: "PingFang SC";
        font-size: 20px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
        letter-spacing: 0.2px;
        text-transform: capitalize;
        margin-left: 12px;
    }

    .cancel:hover,
    .confirm:hover {
        cursor: pointer;
    }
}
</style>